import { defineStore } from 'pinia';
import { ref } from 'vue';
import { useDark, useToggle } from '@vueuse/core';
interface PersistOptions {
    key?: string;
    storage?: Storage;
    paths?: string[];
}
export const useCtrlStore = defineStore('ctrl', () => {
    // 从 localStorage 获取主题状态
    const storedTheme = localStorage.getItem('theme');
    const initialTheme = storedTheme ? JSON.parse(storedTheme).theme : false;
    // 自定义一个空的存储对象，阻止自动保存到 localStorage
    const noopStorage = {
        getItem: () => null,
        setItem: () => {},
        removeItem: () => {}
    };
    // 暗黑模式状态管理
    const isDark = useDark({
        selector: 'html',
        attribute: 'class',
        valueDark: 'dark',
        valueLight: 'light',
        initialValue: initialTheme ? 'dark' : 'light',
        storage: noopStorage,
        listenToStorageChanges: false // 关闭系统主题监听
    });
    // 主题状态
    const theme = ref<boolean>(initialTheme);
    const toggleDark = useToggle(isDark);
    isDark.value = theme.value; // 确保初始同步
    // 切换主题的方法
    const toggleTheme = () => {
        toggleDark();
        theme.value = isDark.value;
        localStorage.setItem('theme', JSON.stringify(isDark.value));
    };
    // 手动检查并确保主题状态与存储一致
    if (typeof window !== 'undefined') {
        // const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
        if (!storedTheme) {
            // 如果 localStorage 中没有保存主题状态，使用初始主题
            isDark.value = initialTheme;
        } else {
            // 确保主题状态与 localStorage 中的值一致
            isDark.value = theme.value;
        }
    }
    return {
        theme,
        toggleTheme,
        isDark
    };
}, {
    persist: {
        key: 'theme',
        storage: localStorage,
        paths: ['theme'] // 明确指定只持久化 theme
    } as PersistOptions // 类型断言
});
    